<template>
    <ul class="statistics">
        <li>
            <p>{{userInfo.browse > 10000 ? (userInfo.browse/10000).toFixed(1) +"万" : userInfo.browse }}</p>
            <p>浏览量</p>
        </li>
        <li>
            <p>{{userInfo.support > 10000 ? (userInfo.support/10000).toFixed(1) +"万" : userInfo.support }}</p>
            <p>获赞数</p>
        </li>
        <li>
            <p>{{userInfo.comments > 10000 ? (userInfo.comments/10000).toFixed(1) +"万" : userInfo.comments }}</p>
            <p>评论量</p>
        </li>
    </ul>
</template>

<script>
import api from "@/api";

export default {
    name: "Statistics",
    data(){
        return{
            userInfo:{
                browse:"",
                support:"",
                comments:"",
            }
        }
    },
    mounted() {
        let user;
       if(this.$route.path==='/home'){
           user = JSON.parse(window.localStorage.getItem("user"));
       }else{
           user = JSON.parse(window.localStorage.getItem("ArticleDetails"));
       }
        if(user != null){
            api.commentsGetAll(user.uid).then((res)=>{
               this.userInfo.comments = res.data.data;

            })
            api.supportGetAll(user.uid).then((res)=>{
                this.userInfo.support = res.data.data;
            })
            api.browseGetAll(user.uid).then((res)=>{
                this.userInfo.browse = res.data.data;
            })
        }


    },
}
</script>

<style scoped>
ul li{
    list-style: none;
    width: 100%
}

.statistics{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5px;
}

.statistics p:first-child{
    font-size: 18px;

}
.statistics p:last-child{

}
p{
    font-size: 15px !important;
}

</style>